<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/css.css" rel="stylesheet" type="text/css" />
<link href="css/common.css" rel="stylesheet" tyle="text/css" />
<s src="js/jquery-1.9.1.min.js" type="text/javascript"></s>
<s src="js/jquery.SuperSlide.2.1.1.js" type="text/javascript"></s>
<s src="js/common_js.js" type="text/javascript"></s>
<style>
     .pic_code{
        float: right;
        width:110px;
        height:40px;
        margin-right:110px;
      }

    #hong{
      
      margin-left: 87px;
      color: #e62e2e;
      }

      
</style>
<title>用户注册</title>
</head>

<body>
<!--顶部样式-->
<div class="common_top">
 <div class="Narrow">
  <div class=" left logo"><a href="#"><img src="images/logo.png" /></a></div>
  <!--电话图层-->
  <div class="phone"><label>全国服务热线：</label><em>400-345-5633</em></div>
 </div>
</div>
<!--用户注册样式-->
<div class="registered_style Narrow clearfix">
   <div class="left_advertising">
    <img src="images/bg_03.png" />
   </div>
   <div class="right_register">
     <div class="register_Switching" id="register_Switching">
       <div class="hd">
        <ul><li>普通注册</li></ul>
       </div>
       
      <form id="app" name="form1" method="post" action="" @submit.prevent="on_submit" >
     <div class="form clearfix" v-cloak>
       <br>
      <div class="item">
        <label class="rgister-label">用&nbsp;&nbsp;户&nbsp;&nbsp;名：</label>
        <!-- <input name="usernamae" type="text"  class="text" /> -->
        <input @blur="check_username" v-model="username" type="text" name="username" id="username">
        <br>
        <span v-show="error_name" id="hong" class="error_tip">{{ error_name_message }}</span>
      </div>
    <div class="item"><label class="rgister-label" >密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码：</label>
      <!-- <input name="password" type="password"  class="text" /> -->
      <input v-model="password" @blur="check_pwd" type="password" name="password" id="pwd">
      <br>
      <span v-show="error_password" id="hong" class="error_tip">请输入8-20位的密码</span>
    </div>
      <!-- <div class="Password_qd"><ul><li class="r">弱</li><li class="z">中</li><li class="q">强</li></ul></div> -->
    <div class="item"><label class="rgister-label " >确认密码：</label>
      <!-- <input name="re_password" type="password"  class="text" /> -->
      <input @blur="check_cpwd" v-model="password2" type="password" name="password2" id="cpwd">
      <br>
      <span v-show="error_check_password"  id="hong" class="error_tip">两次输入的密码不一致</span>
    </div>
      <div class="item"><label class="rgister-label" >手机号:</label>
        <!-- <input name="email" type="text"  class="text" /> -->
        <input @blur="check_phone" v-model="mobile" type="text" name="mobile" id="phone">
        <br>
        <span v-show="error_phone" id="hong"  class="error_tip">请输入正确的手机号码</span>
    
      </div>

      <div class="item "><label  class="rgister-label ">验&nbsp;证&nbsp;码：</label>
        <!-- <input name="image_code" type="text"  class="Recommend_text" /> -->
        <input type="text" v-model="image_code" @blur="check_image_code" name="image_code"
        id="pic_code" class="msg_input Recommend_text">
       <img :src="image_code_url" @click="generate_image_code" alt="图形验证码" class="pic_code">
       <span v-show="error_image_code" id="hong" class="error_tip">{{ error_image_code_message }}</span>
       <!-- <span class="error_tip" id="hong" v-show="error_sms_code">{{ error_sms_code_message }}</span> -->
      </div>



      <div class="item "><label  class="rgister-label ">短信验证：</label>
        <input type="text" v-model="sms_code" @blur="check_sms_code" name="sms_code" id="msg_code"
               class="msg_input">
        <a @click="send_sms_code" class="get_msg_code">{{ sms_code_tip }}</a>
        <br>
        <span class="error_tip" id="hong" v-show="error_sms_code">{{ error_sms_code_message }}</span>
      </div>

    </div>
    <div class="rgister-btn">
    <!-- <a href="javascript:;" class="btn_rgister" id="btn_rgister" type="submit">注 册</a> -->
    <input class="btn_rgister" id="btn_rgister" type="submit" value="注 册">
    </div>
    <div class="Note"><span class="login_link">已是会员<a href="#" class="">请登录</a></span></div>
    </form>
        </ul>
       </div>
     </div>
     <!-- <script>jQuery(".register_Switching").slide({trigger:"click"});</script> -->
    </div>
</div>
<!--底部样式-->
 <div class="bottom_footer">
   <p><a href="#">关于我们</a> | <a href="#">联系我们</a> | <a href="#">商家入驻</a> | <a href="#">法律申明</a> | <a href="#">友情链接</a>  </p>
   <p>Copyright©2014四川金祥保险销售有限公司.All Rights Reserved. </p>
   <p>川ICP备09150084号</p>

   </div>

<script type="text/javascript" src="js/host.js"></script>
<script type="text/javascript" src="js/vue-2.5.16.js"></script>
<script type="text/javascript" src="js/axios-0.18.0.min.js"></script>
<script type="text/javascript" src="js/yanzhenma.js"></script>
<script type="text/javascript" src="js/registered.js"></script>
</body>
</html>
